<script lang="ts">
  import { Greet } from "$lib/wailsjs/go/main/App.js";
  import { modalStore,toastStore } from '@skeletonlabs/skeleton';
  import type { ToastSettings,ModalSettings } from '@skeletonlabs/skeleton';

  

  function triggerAlert(): void {
    const alert: ModalSettings = {
      //type: 'alert' | 'confirm' | 'prompt' | 'component';      
      type: 'confirm',
      title: 'Example Alert',
      body: 'This is an example modal.',
      buttonTextCancel: 'Cancel'
    };
    modalStore.trigger(alert);
  }

  function triggerToast(): void {
		const t: ToastSettings = {			
			message: '<p>Welcome to Wails</p><p>Cross platform application develop is cool.</p>',					
			autohide: true,
			timeout: 5000,			
			// action: {
			// 	label: 'Greeting',
			// 	response: () => alert('Hello, Skeleton')
			// },
			background:'variant-filled-error',			
			callback:(response) => {
				console.log(response.id)
			}
		};
		toastStore.trigger(t);
	}
</script>

<div class="mx-auto p-6 space-y-6">  
  <p>
    <button class="btn variant-filled-primary" on:click={triggerAlert}>Hello Model</button>
  </p>

  <p>
    <button class="btn variant-filled-primary" on:click={triggerToast}>Hello Toast</button>
  </p>
</div>
